import Vue from 'vue';
import loadingComponent from '../components/Loadding'
import alertComponent from '../components/Alert'

const ToastConstructor = Vue.extend(loadingComponent)
const AlertConstructor = Vue.extend(alertComponent)
const $tools = {
  install(Vue) {
    Vue.prototype.$tools = {
        alert(type,msg, duration = 8000){
            const toastDom = new AlertConstructor({
                el: document.createElement('div'),
                data () {
                    return {
                      type: type,
                      msg: msg,   
                      showWrap: true,  // 作用:在隐藏组件之前,显示隐藏动画
                      showContent: true  // 作用:在隐藏组件之前,显示隐藏动画
                    }
                }
            })
            //console.log("toastDom.$el:",toastDom.$el,"msg:",msg)
            document.getElementById("alertBox").appendChild(toastDom.$el)
            setTimeout(() => { toastDom.showContent = false }, duration - 550)
            setTimeout(() => { toastDom.showWrap = false }, duration)
        },
        hideToast(){
          // var l = document.getElementsByClassName("loading-container").length
          // for(var i=0;i<l;i++){
          //   document.getElementsByClassName("loading-container").item(i).remove();
          // }
          $(".loading-container").eq(0).remove();
        },
        nextPage(fuc){
          $(window).unbind("scroll");
          $(window).scroll(function(){
            var scrollTop = $(this).scrollTop();
            var scrollHeight = $(document).height();
            var windowHeight = $(this).height();
            // console.log("scrollHeight:",scrollHeight,"scrollTop:",scrollTop,"windowHeight:",windowHeight )
            if(scrollHeight - (scrollTop + windowHeight )  <80){
              // console.log("you are in the bottom");
              fuc?fuc():'';
            }
          });
        },
        showToast (text, duration = 8000) {
          const toastDom = new ToastConstructor({
              el: document.createElement('div'),
              data () {
                  return {
                      text: text,
                      showWrap: true,    // 是否显示组件
                      showContent: true  // 作用:在隐藏组件之前,显示隐藏动画
                  }
              }
          })
          document.body.appendChild(toastDom.$el)
          setTimeout(() => { toastDom.showContent = false }, duration - 1250)
          setTimeout(() => { toastDom.showWrap = false }, duration)
      }

      
      

    }
  },
};

Vue.use($tools);

